<!DOCTYPE html>
<html lang="en" dir="ltr">

<head>
  <meta charset="utf-8">
  <title></title>
  <style lang="css">
    .spinner {
      width: 80px;
      height: 80px;
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
    }
    .loading {
      position: absolute;
      left: 0;
      top: 0;
      line-height: 80px;
      width: 100%;
      text-align: center;
      font-size: 14px;
      color: #999;
    }
    .container1>div,
    .container2>div,
    .container3>div {
      width: 10px;
      height: 10px;
      background-color: #999;

      border-radius: 100%;
      position: absolute;
      -webkit-animation: bouncedelay 1.2s infinite ease-in-out;
      animation: bouncedelay 1.2s infinite ease-in-out;
      -webkit-animation-fill-mode: both;
      animation-fill-mode: both;
    }

    .spinner .spinner-container {
      position: absolute;
      width: 100%;
      height: 100%;
    }

    .container2 {
      -webkit-transform: rotateZ(45deg);
      transform: rotateZ(45deg);
    }

    .container3 {
      -webkit-transform: rotateZ(90deg);
      transform: rotateZ(90deg);
    }

    .circle1 {
      top: 0;
      left: 0;
    }

    .circle2 {
      top: 0;
      right: 0;
    }

    .circle3 {
      right: 0;
      bottom: 0;
    }

    .circle4 {
      left: 0;
      bottom: 0;
    }

    .container2 .circle1 {
      -webkit-animation-delay: -1.1s;
      animation-delay: -1.1s;
    }

    .container3 .circle1 {
      -webkit-animation-delay: -1.0s;
      animation-delay: -1.0s;
    }

    .container1 .circle2 {
      -webkit-animation-delay: -0.9s;
      animation-delay: -0.9s;
    }

    .container2 .circle2 {
      -webkit-animation-delay: -0.8s;
      animation-delay: -0.8s;
    }

    .container3 .circle2 {
      -webkit-animation-delay: -0.7s;
      animation-delay: -0.7s;
    }

    .container1 .circle3 {
      -webkit-animation-delay: -0.6s;
      animation-delay: -0.6s;
    }

    .container2 .circle3 {
      -webkit-animation-delay: -0.5s;
      animation-delay: -0.5s;
    }

    .container3 .circle3 {
      -webkit-animation-delay: -0.4s;
      animation-delay: -0.4s;
    }

    .container1 .circle4 {
      -webkit-animation-delay: -0.3s;
      animation-delay: -0.3s;
    }

    .container2 .circle4 {
      -webkit-animation-delay: -0.2s;
      animation-delay: -0.2s;
    }

    .container3 .circle4 {
      -webkit-animation-delay: -0.1s;
      animation-delay: -0.1s;
    }

    @-webkit-keyframes bouncedelay {

      0%,
      80%,
      100% {
        -webkit-transform: scale(0.0)
      }

      40% {
        -webkit-transform: scale(1.0)
      }
    }

    @keyframes bouncedelay {

      0%,
      80%,
      100% {
        transform: scale(0.0);
        -webkit-transform: scale(0.0);
      }

      40% {
        transform: scale(1.0);
        -webkit-transform: scale(1.0);
      }
    }
  </style>
  <link rel="stylesheet" href="styles/app/blue/blue.min.css">
</head>

<body>
  <div class="spinner">
    <div class="loading">登录中...</div>
    <div class="spinner-container container1">
      <div class="circle1"></div>
      <div class="circle2"></div>
      <div class="circle3"></div>
      <div class="circle4"></div>
    </div>
    <div class="spinner-container container2">
      <div class="circle1"></div>
      <div class="circle2"></div>
      <div class="circle3"></div>
      <div class="circle4"></div>
    </div>
    <div class="spinner-container container3">
      <div class="circle1"></div>
      <div class="circle2"></div>
      <div class="circle3"></div>
      <div class="circle4"></div>
    </div>
  </div>
</body>

</html>

<script src="scripts/libs/jquery_1.9.1.js" charset="utf-8"></script>
<script src="scripts/libs/cookie_2.1.3.js" charset="utf-8"></script>
<script src="scripts/app/toast_1.0.0.js" charset="utf-8"></script>
<script src="scripts/app/storage.js" charset="utf-8"></script>
<script src="scripts/app/http.js" charset="utf-8"></script>
<script type="text/javascript">
  window.onload = function () {
    var token = getQueryString('loginToken')
    var tc = getQueryString('tc')
    var index = getQueryString('index')
    if (!token) return

    hlhttp.post({
      url: 'open/auth/login',
      data: {login_token: token, tc: tc, index: index},
      success: function (data) {
        var userMes = {
          id: data.id,
          name: data.name,
          account: data.account,
          phone: data.phone,
          email: data.email,
          tenantType: data.tenantType,
          tenantId:data.tenantId,
          isAdmin:data.isAdmin,
          ico: data.cstmFaviconUrl || '',
          logo: data.cstmLogoUrl || '',
          title: data.cstmWebTitle || '',
          preSysCode: data.preSysCode || '',
          cstmHomepage: data.cstmHomepage || '',
          oauthType:data.oauthType || ''
        }
        Cookies.set("token", data.token, {expires: 30})
        window.localStorage.setItem('userMes', JSON.stringify(userMes))
        window.sessionStorage.setItem('names', data.name)
        // 清除原来所用的存储字段
        var originalArr = [
          'names',
          'navPos',
          'projectName',
          'unitData',
          'contractNav1'
        ]
        hlStorage.lsClearMultipleKey(originalArr)
        setTimeout(function () {
          var pathname = window.location.pathname.replace('loading', 'index')
          window.location.href = './#/home';
        }, 1000)
      },
      error: function (res) {
        hl.toast(JSON.parse(res.responseText).msg)
      }
    })
  }

  function getQueryString(name) {
    var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
    var r = window.location.href.substr(window.location.href.indexOf('?') + 1).match(reg);
    if (r != null) {
      return unescape(r[2]);
    }
    return null;
  }
</script>
